@baseWidth: 720;
.px2rem(@atr,@px,@base-width:0) when( @base-width > 0){
	@{atr}: unit(@px*10/@base-width , rem);
}

.px2rem(@atr,@px,@base-width:0) when( @base-width = 0){
	@{atr}: unit(@px*10/@baseWidth , rem);
}

.List{
    .items{
        display: flex;
        align-items: center;
        -webkit-box-align: center;
        .px2rem(padding, 20);
        .px2rem(padding-top, 10);
        .px2rem(padding-bottom, 10);
        border-bottom: 1px solid #f5f2f2;
        color: #888;
        .thumb{
            .px2rem(font-size, 30);
            .px2rem(line-height, 30);
            .px2rem(margin-right, 10);
            color: #4482ff;
        }
        .line{
            align-items: center;
            -webkit-box-align: center;
            display: flex;
            -webkit-box-flex: 1;
            flex: 1;
            align-self: stretch;
            span{
                .px2rem(font-size, 18);
            }
            .content{
                flex: 1;
                width: auto;
                text-align: left;
                .px2rem(font-size, 22);
            }
            .extra{
                .px2rem(font-size, 20);
                flex-basis: 36%;
                text-align: right;
                color: #4482ff;
            }
        }
    }
}